<template>
    <v-card>
        <v-card-title></v-card-title>
        <v-card-text>
            <v-data-table
                :headers="headers"
                :items="desserts"
                height="600px"
                fixed-header
                checkbox-color="green"
                :items-per-page="bar.page"
            >
                <template v-slot:top>
                    <v-toolbar
                        flat
                        :color="bar.class"
                        :dark="bar.dark"
                        dense
                    >
                        <v-toolbar-title><h4>{{ node.name }} 的结果展示：</h4></v-toolbar-title>
                        <!-- <v-divider
                        class="mx-4"
                        inset
                        vertical
                        ></v-divider> -->
                    </v-toolbar>
                </template>
                <!-- <v-data-footer
                disable-items-per-page
                ></v-data-footer> -->
            </v-data-table>
        </v-card-text>
    </v-card>
</template>

<script>
import { defineComponent } from '@vue/composition-api'


export default defineComponent({
    setup() {
        
    },
    props: {
        node: {
            type: Object,
            default: {'id': null, 'name': null}
        },
    },
    data(){
        return {
            bar: { class: 'green',  dark: false },
            headers: [],
            desserts: [],
        }
    },
    mounted(){
        this.initialize()
    },
    methods: {
        initialize () {
            let get_post = {'id': this.node.id}
            this.$api.scene.getTable(get_post).then(res=>{
                let table_data = JSON.parse(res.data.data)
                this.headers = table_data.headers
                this.desserts = table_data.desserts
            })
        },
        
        
    }
})
</script>

<style scoped>

</style>